<div class="row">
<div class="col-xs-12">
<div class="box">
<div class="box-body">
	<table class="table">
		<tbody>
			<tr>
				<td style="width: 280px; vertical-align: top;padding-left: 0;">
					<ul id="ztree_ul" class="ztree"></ul>
					<button id="ztree_root_btn" type="button" class="btn btn-link" style="display: none;float: right;" onclick="_addRootNode();"><i class="fa fa-plus"></i>&nbsp;&nbsp;添加一级目录</button>
				</td>
				<td id="ztree_detail" data-current-tid="" style="vertical-align: top;padding-top:10px"></td>
			</tr>
		</tbody>
	</table>
</div>
</div>
</div>
</div>
<script type="text/javascript">
	var ztree_id = "ztree_ul";
	var ztree_new_id = 0;
	var ztree_level = 3;//最大树级别
	var ztree_root_id=0;
	var ztree_root_add = false;//允许添加顶级节点
	var ztree_root_del = true;//允许删除顶级节点
	var ztree_drag_all = true;//可以自由移动，否则只允许同级移动
	var ztree_mgr_pv = false; //管理权限
	var ztree_title="";
	var ztree_controller="";
	
	function _addRootNode(){
		var zTree = $.fn.zTree.getZTreeObj(ztree_id);
		var node={id:'new_'+(ztree_new_id++),pId:ztree_root_id,name:"新增"+ztree_title,attributes:{url:""}};
		var res=zTree.addNodes(null, node);
		_zTreeOnClick(this, ztree_id, res[0]);
	}
	function _addHoverDom(treeId, treeNode) {
		if(!ztree_mgr_pv)return;//没有管理权限
		if(treeNode.level>(ztree_level-2))return;//最多三级目录
		if(isNewType(treeNode))return;
		var sObj = $("#" + treeNode.tId + "_span");
		if (treeNode.editNameFlag || $("#addBtn_" + treeNode.tId).length > 0) return;
		var addStr = "<span class='button add' id='addBtn_" + treeNode.tId + "' title='新增' onfocus='this.blur();'></span>";
		sObj.after(addStr);
		var btn = $("#addBtn_" + treeNode.tId);
		if (btn)
			btn.bind("click", function(e) {
				var node = { id : 'new_' + (ztree_new_id++), pId : treeNode.id, name : "新增"+ztree_title ,attributes:{}};
				var zTree = $.fn.zTree.getZTreeObj(ztree_id);
				var res = zTree.addNodes(treeNode, node);
				_zTreeOnClick(e, ztree_id, res[0]);
				return false;
			});
	};
	function _removeHoverDom(treeId, treeNode) {
		$("#addBtn_" + treeNode.tId).unbind().remove();
	};
	function _beforeRemove(treeId, treeNode) {
		return confirm("确认删除"+ztree_title+"：" + treeNode.name + " 吗？");
	}
	function _onDrop(e, treeId, treeNodes, targetNode, moveType, isCopy) {
		if (moveType == null)return;
		var treeNode = treeNodes[0];
		if (isNewType(treeNode))return;
		var nodes=_getPeerNodes(treeNode.tId);
		var ids="";
		for(var i=0;i<nodes.length;i++){
			if(ids!="")ids+="-";
			ids+=nodes[i].id;
		}
		if(ids==""){
			ids=treeNode.id;
		}
		$.post(ztree_controller+"/updateSort/"+ids, function(data) {
			if (!data.success) {
				showMsg("设置" + treeNode.name + "失败","error");
			}
		});
	}
	function _isDragLevel(treeId, nodes, targetNode) {//是否只能同层次同级移动
		if(ztree_drag_all)return true;
		var np = nodes[0].getParentNode();
		var tp = targetNode.getParentNode();
		if (null == np) {
			np = { id : 0 };
		}
		if (null == tp) {
			tp = { id : 0 };
		}
		return tp.id == np.id;
	}
	function _onRemove(e, treeId, treeNode) {
		if (isNewType(treeNode)){
			_zTreeOnClick(e, treeId, treeNode.getParentNode());
			return;
		}
		$.post(ztree_controller+"/delete/" + treeNode.id, function(data) {
			showMsg("删除" + treeNode.name +(data.success? "成功": "失败"),(data.success? "success": "error"));
			if (data.success) {
				_zTreeOnClick(e, treeId, treeNode.getParentNode());
			}
		});
	};
	function _updateZtreeNode(id,name){
		var zTree = $.fn.zTree.getZTreeObj(ztree_id);
		var node=_getCurrentNode();
		if(null==node)return;
		node.id=id;
		node.name=name;
		zTree.updateNode(node);
	};
	function _zTreeOnClick(event, treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj(treeId);
		zTree.selectNode(treeNode);
		var url=treeNode.attributes.url;
		if(_.isEmpty(url)){
			url=ztree_controller+"/form/"+treeNode.id+"-"+(_.isEmpty(treeNode.pId)?0:treeNode.pId)+"-"+treeNode.getIndex()+"-"+treeNode.name;
		}
		$("#ztree_detail").data("current-tid",treeNode.tId).load(url,function(){
			new autoEventListener($("#ztree_detail"),true);
		});
	};
	function isNewType(treeNode) {
		return (treeNode.id+"").indexOf("new_")==0;
	};
	//获取当前编辑节点
	function _getCurrentNode(){  
		var zTree = $.fn.zTree.getZTreeObj(ztree_id);
		var oldId=$("#ztree_detail").data("current-tid");
		var node=zTree.getNodeByTId(oldId);
		return node;
	};
	//获取当前节点的根节点(treeNode为当前节点)  
	function _getCurrentNodeRoot(treeNode){  
	   if(treeNode.getParentNode()!=null){    
	      var parentNode = treeNode.getParentNode();    
	      return _getCurrentNodeRoot(parentNode);    
	   }else{    
	      return treeNode;   
	   }  
	};
	//获取兄弟节点
	function _getPeerNodes(tId){
		var zTree = $.fn.zTree.getZTreeObj(ztree_id);
		var treeNode = zTree.getNodeByTId(tId);
		if(treeNode != null){
			if(treeNode.getParentNode() != null) {
				return treeNode.getParentNode().children;
			}else if(treeNode.level==0){//根结点
				return zTree.getNodesByParam("level", "0", null);
			}
		}
		return null;
	};
	function _ztree(title, controller, dragAll, rootAdd, rootDel, mgrPv) {
		ztree_title = title;
		ztree_controller = controller;
		ztree_root_add = rootAdd;
		ztree_root_del = rootDel;
		ztree_drag_all = dragAll;
		ztree_mgr_pv = mgrPv;
		var _ztreeSetting = {
			data : {
				simpleData : {
					enable : true
				}
			},
			async : {
				enable : true,
				url : ztree_controller + "/children",
				autoParam : [ "id" ],
				type : "post"
			},
			view : {
				addHoverDom : _addHoverDom,
				removeHoverDom : _removeHoverDom,
				selectedMulti : false
			},
			edit : {
				enable : ztree_mgr_pv,
				editNameSelectAll : true,
				removeTitle : "删除",
				showRenameBtn : false,
				showRemoveBtn : function(treeId, treeNode) {
					if(!ztree_mgr_pv)return false;//没有管理权限
					if (treeNode.isParent)
						return false;//有子节点不允许删除
					if (!ztree_root_del) {//顶级节点不允许删除
						return treeNode.level != 0;
					}
					return true;
				},
				drag : {
					isMove : true,
					inner : false,
					prev : _isDragLevel,
					next : _isDragLevel
				}
			},
			callback : {
				beforeDrag : function() {
					return false
				},
				beforeRemove : _beforeRemove,
				onRemove : _onRemove,
				beforeDrag : true,
				onDrop : _onDrop,
				onClick : _zTreeOnClick
			}
		};
		$.fn.zTree.init($("#" + ztree_id), _ztreeSetting);
		if (ztree_root_add) {
			$("#ztree_root_btn").show();
		}
	};
</script>